<template>
  <div>
    <c-title :hide="false" text="数据"></c-title>
    <div class="flex-col flex-1 group">
      <div class="flex-row items-center group_2">
        <img class="image_5" src="https://shops.cg500.com/static/newimg/17036585054531465882.png" />
        <div class="flex-row justify-between" style="width:calc(100% - 30px);">
          <input class="text_2 ml-7 flex-row flex-1" placeholder="搜索成员姓名/手机号" v-model="text" />
          <div class="btn" @click="checkList">搜索</div>
        </div>
      </div>
      <div class="flex-col mt-20-5">
        <div class="flex-col list">
          <div class="flex-row justify-between items-center list-item" v-for="(item, index) in list" :key="index" @click="partnerDetails(item.uid)">
            <div class="flex-row items-center">
              <img class="image_6" :src="item.avatar" />
              <div class="flex-col items-start ml-7">
                <span class="font_2">{{ item.nickname }}</span>
                <span class="mt-8 font_4 text_3">{{ item.mobile }}</span>
              </div>
            </div>
            <div class="flex-row group_3">
              <span class="font">当月总额</span>
              <span class="ml-6 font_3">{{ item.all_yeji }}</span>
              <!-- <img class="ml-6 shrink-0 image_7" src="https://ide.code.fun/api/image?token=66271747bba59d0011bfea37&name=4d43e9ed504af76d519411b038b45f7f.png" /> -->
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import partnerListController from "./partnerListController";

export default partnerListController;
</script>


<style lang="scss" rel="stylesheet/scss" scoped>
@import "../common/common.css";
.ml-7 {
  margin-left: 7px;
}
.mt-20-5 {
  margin-top: 20px;
}
.group {
  padding: 10px 0 80px;
  overflow-y: auto;
}
.group_2 {
  margin-left: 16px;
  margin-right: 13px;
  padding: 3px 10px;
  border-radius: 16px;
  border: 1px solid #dddddd;
}
.image_5 {
  width: 16px;
  height: 16px;
  margin: 0 !important;
}
.text_2 {
  color: #999999;
  font-size: 13px;
  font-family: PingFang;
  line-height: 13px;
  border: none;
  // width: 80%;
}
.section_3 {
  padding: 13px 14px 9px;
  background-color: #f8f8f8;
}
.font {
  font-size: 12px;
  font-family: PingFang SC;
  line-height: 12px;
  color: #999999;
}
.list {
  padding-left: 14px;
  background-color: #fff;
  border-bottom: 1px solid #ededed;
}
.list-item {
  padding: 15px 2px 13px;
  border-bottom: solid 1px #eeeeee;
}
.image_6 {
  width: 40px;
  height: 41px;
  border-radius: 20px;
}
.btn {
  width: 50px;
  height: 25px;
  border-radius: 20px;
  border: 1px solid #d1cece;
  display: flex;
  justify-content: center;
  align-items: center;
  // margin-left: 100px;
}

.font_2 {
  font-size: 14px;
  font-family: PingFang;
  line-height: 13px;
  color: #151515;
}
.font_4 {
  font-size: 14px;
  font-family: PingFang;
  line-height: 12px;
  color: #151515;
}
.text_3 {
  line-height: 11px;
}
.group_3 {
  margin-right: 13px;
}
.font_3 {
  font-size: 18px;
  font-family: PingFang SC;
  line-height: 14px;
  font-weight: 500;
  color: #151515;
}
.image_7 {
  width: 7px;
  height: 12px;
}
</style>
